<%= turbo_frame_tag Avo::ACTIONS_BACKGROUND_FRAME_ID, src: @background_url, loading: :lazy, target: :_top, class: "block" do %>
  <%= render Avo::LoadingComponent.new(title: "...") %>
<% end %>

<%= turbo_frame_tag Avo::MODAL_FRAME_ID do %>
  <div
    data-controller="<%= ["action", @action.get_stimulus_controllers].join(" ") %>"
    data-action-no-confirmation-value="<%= @action.no_confirmation? %>"
    data-action-resource-name-value="<%= @resource.model_key %>"
    data-resource-id="<%= params[:id] %>"
    class="hidden text-slate-800"
  >
    <%= form_with scope: 'fields',
      url: @action.link_arguments(resource: @resource).first,
      local: true,
      html: {
        novalidate: true,
      },
      data: {
        action_target: :form,
        **@action.class.form_data_attributes,
      } do |form|
    %>
    <%= render Avo::ModalComponent.new(close_modal_on_backdrop_click: @action.close_modal_on_backdrop_click) do |c| %>
      <% c.with_heading do %>
        <%= @action.action_name %>
      <% end %>

      <div class="flex-1 flex">
        <%= @action.get_message %>
      </div>
      <%= form.hidden_field :avo_resource_ids, value: params[:id] || params[:resource_ids], 'data-action-target': 'resourceIds' %>
      <%= form.hidden_field :avo_selected_all, 'data-action-target': 'selectedAll' %>
      <%= form.hidden_field :avo_index_query, 'data-action-target': 'indexQuery' %>
      <%= form.hidden_field :arguments, value: params[:arguments] %>
      <% if @fields.present? %>
        <div class="mt-4 -mx-6">
          <% @fields.each_with_index do |field, index| %>
            <%= render field
              .hydrate(resource: @resource, record: @resource.record, user: @resource.user, view: @view, action: @action)
              .component_for_view(@view)
              .new(field: field, resource: @resource, index: index, form: form, compact: true, autofocus: index == 0)
            %>
          <% end %>
        </div>
      <% end %>

      <% c.with_controls do %>
        <%= a_button type: :button,
          data: { action: 'click->modal#close' },
          size: :sm,
          color: :gray do %>
          <%= @action.cancel_button_label %>
        <% end %>
        <%= a_button type: :submit,
            color: :green,
            style: :primary,
            size: :sm,
            data: {
              target: :submit_action,
            },
            autofocus: @fields.reject { |field| field.is_a?(Avo::Fields::HiddenField) }.empty? do %>
          <%= @action.confirm_button_label %>
        <% end %>
      <% end %>
    <% end %>
  <% end %>
</div>
<% end %>
